(function () {
    const oEchart = echarts.init(document.getElementById('bar02'));
    oEchart.setOption({
        title: { //标题
            text: '横向bar',
            left: 'center', //标题位置设置left、top、right、bottom
            top: 10,
            textStyle: { //样式配置
                color: '#F57474',
                fontSize: 12
            },
            borderWidth: 1, //边框配置
            borderColor: 'pink',
            borderRadius: 6 //边框圆角
        },
        tooltip: { //提示框设置
            show: true,
            formatter: '{b} 是 {c}', //数据格式化处理
            triggerOn: 'mousemove', //触发时机：mousemove|click|none
            trigger: 'axis' //触发类型: item(鼠标移入到具体的图形上)/axis(鼠标移入即提示,带分割线)
        },
        toolbox: { //工具按钮设置
            feature: {
                saveAsImage: {}, //显示下载保存图片按钮
                dataView: {}, //显示数据视图按钮，点击转成表格
                restore: {}, //显示重置还原按钮
                dataZoom: {}, //显示区域缩放、还原区域缩放按钮
                magicType: { //图表类型切换按钮
                    type: ['bar', 'line']
                }
            }
        },
        //横向柱状图，只需要将x和y轴的配置数据调换即可
        xAxis: {
            type: 'value',
            data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
        },
        yAxis: {
            type: 'category',
            data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
        },
        series: [
            {
                data: [820, 932, 901, 934, 1290, 1330, 1320],
                type: 'bar',
                barWidth: '30%', //设置柱形的宽度
                markPoint: {//最大值,最小值
                    data: [
                        { type: 'max', name: '最大值' },
                        { type: 'min', name: '最小值' }
                    ]
                },
                markLine: { //平均值
                    data: [
                        { type: 'average', name: '平均值' }
                    ]
                },
                label: {
                    rotate: 60, //旋转角度
                    position: 'top', //数值位置
                    show: true //显示具体数值
                }
            }
        ]
    })
})()